<template>
  <div style="width: 90%; margin: 10px auto">
    <div>
      <el-form :model="form" label-width="auto" style="max-width: 600px">
        <el-form-item label="用户名">
          <span>{{ form.accountNumber }}</span>
        </el-form-item>

        <el-form-item label="姓名">
          <span>{{ form.staffName }}</span>
        </el-form-item>

        <el-form-item label="性别">
          <span v-if="form.gender == true">女</span>
          <span v-if="form.gender == false">男</span>
        </el-form-item>

        <el-form-item label="员工编号">
          <span>{{ form.employeeID }}</span>
        </el-form-item>

        <el-form-item label="身份证号">
          <span>{{ form.idNumber }}</span>
        </el-form-item>

        <el-form-item label="手机号">
          <span>{{ form.phone }}</span>
        </el-form-item>

        <el-form-item label="所在地址">
          <span>{{
            form.area.replace("/", "").replace("/", "") + form.location
          }}</span>
        </el-form-item>

        <el-form-item label="部门">
          <span>{{ form.departmentName }}</span>
        </el-form-item>

        <el-form-item label="职务">
          <span>{{ form.postName }}</span>
        </el-form-item>

        <el-form-item label="岗位">
          <span>{{ form.stationName }}</span>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>
<script lang="ts" setup>
import axios from "axios";

//个人信息
const form = reactive({
  accountNumber: "",
  staffName: "",
  gender: null,
  employeeID: "",
  idNumber: "",
  phone: "",
  area: "",
  location: "",
  departmentName: "",
  postName: "",
  stationName: "",
});

//获取个人信息
const getInfo = () => {
  const staffId = localStorage.getItem("staffId");

  //console.log(staffId);

  axios
    .get("Readroute/api/StaffInfo/GetPersonageInfo?staffId=" + staffId)
    .then((res) => {
      //console.log(res.data);
      form.accountNumber = res.data.accountNumber;
      form.staffName = res.data.staffName;
      form.gender = res.data.gender;
      form.employeeID = res.data.employeeID;
      form.idNumber = res.data.idNumber;
      form.phone = res.data.phone;
      form.area = res.data.area;
      form.location = res.data.location;
      form.departmentName = res.data.departmentName;
      form.postName = res.data.postName;
      form.stationName = res.data.stationName;
    });
};

onMounted(() => {
  getInfo();
});
</script>
<style></style>